<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<!DOCTYPE html>
<html>
<%@include file="../base/frameBase.jsp" %>
<body >
<table style="width:100%;height:100%">
	<tr>
	<td><div id="main" style="width: 600px;height:400px;"></div></td>
	<td><div id="main2" style="width: 600px;height:400px"></div></td>
	</tr>
</table>
	
<script>
// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
var myChart2 = echarts.init(document.getElementById('main2'));
// 指定图表的配置项和数据
var option = {
    title: {
        text: '用户观看兴趣分析'
    },
    tooltip: {},
    legend: {
        data:['兴趣分析']
    },
    xAxis: {
        data: ["5分钟内","30分钟内","1小时内","2小时内","2小时以上","3小时以上"]
    },
    yAxis: {},
    series: [{
        name: '分钟',
        type: 'bar',
        data: [5, 20, 36, 10, 10, 20]
    }]
};

// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);

var pieOption = {
	    title : {
	        text: '最受喜爱课程排行',
	        subtext: '排名前5课程',
	        x:'center'
	    },
	    tooltip : {
	        trigger: 'item',
	        formatter: "{a} <br/>{b} : {c} ({d}%)"
	    },
	    legend: {
	        orient: 'vertical',
	        left: 'left',
	        data: ['文言文解析','C++编程入门','太极拳教学','java课程开发体系','动词分类','其他']
	    },
	    series : [
	        {
	            name: '站内数据',
	            type: 'pie',
	            radius : '55%',
	            center: ['50%', '60%'],
	            data:[
	                {value:335, name:'文言文解析'},
	                {value:310, name:'C++编程入门'},
	                {value:234, name:'太极拳教学'},
	                {value:135, name:'java课程开发体系'},
	                {value:154, name:'动词分类'},
	                {value:1548, name:'其他'}
	            ],
	            itemStyle: {
	                emphasis: {
	                    shadowBlur: 10,
	                    shadowOffsetX: 0,
	                    shadowColor: 'rgba(0, 0, 0, 0.5)'
	                }
	            }
	        }
	    ]
	};






myChart2.setOption(pieOption);
</script>
<%@include file="../base/frameFoot.jsp" %>